/*
 * @Author: hui 
 * @Date: 2019-06-06 19:44:45 
 * @Last Modified by: syyao
 * @Last Modified time: 2019-06-11 20:00:53
 */
<template>
    <div class="picPerHubStyle" >
        <!--图片-->
        <div  name="picture" class="picPerHub" :style="note">
            <Row>
                <i-col span="12">
                    <Checkbox
                        v-model="isChoose"
                        style="margin-top:0.3vw;margin-left:-1.3vw"
                        @on-change="click"
                    ></Checkbox>
                </i-col>
                <i-col span="12">
                    <div class="picStatus" v-if="pictureInfo.state==='public'">已发布</div>
                    <div class="picStatus" style="background-color: #FFAB2D" v-else>未发布</div>
                </i-col>
            </Row>
        </div>

      
        <!--图片名字-->
        <!-- <div style="margin-top:0.6vw;">
            <img src="../../assets/camera.png">
            <span>风景</span>
        </div>-->
        <!-- 图片标签 -->
        <!-- <div style="margin-top:0.6vw;">
            <img src="../../assets/tab1.png">
            <span>风景 动漫</span>
        </div>-->
    </div>
</template>

<script>
export default {
  data() {
    return {
      note: {
        backgroundImage: "url(" + "'" + this.pictureInfo.picturepath + "'" + ")"
      },
      isChoose: false,
     
    };
  },
  props: {
    pictureInfo: {
      type: Object,
      default: function() {
        return {};
      }
    }
  },
  created() {},
 
  methods: {
    click(temp) {
      this.$emit("changeState", {
        ischoose: temp,
        info: { ...this.pictureInfo }
      });
    },
    choose() {
      this.isChoose = true;
    },
    unchoose(){
      this.isChoose=false;
    }
  
  }
};
</script>

<style scoped>
.picPerHub {
  /* background-image: url(../../assets/l-bj.jpg); */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  width: 10vw;
  height: 10vw;
  border-radius: 10px;
}

.picPerHubStyle {
  margin-top: 18px;
}
.picPerHubStyle img {
  width: 1vw;
  vertical-align: middle;
}

.picPerHubStyle span {
  margin-left: 0.8vw;
  font-size: 0.9vw;
  color: #1e1e1e;
  font-family: DengXian;
}

.picStatus {
  background-color: #43a5f1;
  color: #fff;
  width: 60%;
  text-align: center;
  border-radius: 0 10px 0 0;
  float: right;
  font-size: 0.5vw;
  line-height: 1.5;
}
</style>